<template>
  <view class="content">
    <view class="ul">
    	<view>使用帮助：</view>
    	<view>1. 请居民手持二维码和身份证</view>
    	<view>2. 门岗工作人员点击下方“扫描二维码通行证”按钮扫描二维码</view>
    	<view>3. 根据扫描结果和身份证核对居民身份信息</view>
    	<view>4. 对居民进行体温检测和其他事项检查</view>
    	<view>5. 填报居民出行记录并提交</view>
    	<view>6. 门岗放行</view>
    	<view>&nbsp;</view>
    	<view>&nbsp;</view>
    	<view>&nbsp;</view>
    </view>
    <view class="uni-padding-wrap uni-common-mt">
      <button type="primary" @tap="scan">扫描二维码通行证</button>
    </view>
  </view>
</template>

<script>
  import {
    mapState
  } from 'vuex'

  export default {
    methods: {
      scan() {
        uni.scanCode({
          onlyFromCamera: true,
          success: function(res) {
            console.log('条码类型：' + res.scanType)
            console.log('条码内容：' + res.result)
            if (res.scanType != 'QR_CODE') {
              uni.showToast({
                icon: 'none',
                title: '不是二维码哦？',
              });
            } else {
              const residentId = res.result
              uni.navigateTo({
                url: '/pages/passrecord/passrecord?residentId=' + residentId
              });
            }
          }
        });
      }
    },
    computed: mapState(['forcedLogin', 'hasLogin', 'userName']),
    onLoad() {
      if (!this.hasLogin) {
        uni.showModal({
          title: '未登录',
          content: '您未登录，需要登录后才能继续',
          /**
           * 如果需要强制登录，不显示取消按钮
           */
          showCancel: !this.forcedLogin,
          success: (res) => {
            if (res.confirm) {
              /**
               * 如果需要强制登录，使用reLaunch方式
               */
              if (this.forcedLogin) {
                uni.reLaunch({
                  url: '../login/login'
                });
              } else {
                uni.navigateTo({
                  url: '../login/login'
                });
              }
            }
          }
        });
      }
    }
  }
</script>

<style>
  .hello {
    display: flex;
    flex: 1;
    flex-direction: column;
  }

  .title {
    color: #8f8f94;
    margin-top: 25px;
  }

  .ul {
    font-size: 15px;
    color: #8f8f94;
    margin-top: 25px;
  }

  .ul>view {
    line-height: 25px;
  }
</style>
